<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h3>JavaScript访问DOM数案例</h3>
		<!--
		 
		 tag:
		 className:
		 name:
		 id:
		 
		 -->
		<a class="hao" name="号" id="1" href="https://www.hao123.com/" target="_blank">t</a>
		<a class="tb" name="淘宝" id="2" href="https://www.taobao.com/ " target="_blank">j</a>
		<a href="https://www.baidu.com/" target="_blank">t</a>
		<a href="">p</a>
		<a href="">J</a>
		<!-- 在页面上使用Javascript，通过script标签来实现 -->
		<!-- 
		 type="text/javascript"------新标准中为默认值，可省略
		 src=""----引入外部js    jquery.js
		 
		 js出错是不提示的，需要按F12里面的console控制台才能看到错误
		 -->
		<script >
		/* 	window.alert("使用js获取页面内容"); //BOM中提供弹出框api
			/*
			 获取页面a标签，按tagName方式返回是一个数组
			 第一个元素：arr[0],下标从0开始
			 */
			/*
			alert(document.getElementsByTagName("a")[0] );
			window.alert(document.getElementsByTagName("a")[0].innerText); 
			*/
			/* 
			alter逐渐被
			  谷歌浏览器提供的console方式替代 
			 */
			console.log(document.getElementsByTagName("a")[0]);
			console.log(document.getElementsByTagName("a")[0].innerText);
			
			/* 
			 获取页面a标签，按className方式返回
			 */
			console.log(document.getElementsByClassName("hao")[0]);
			console.log(document.getElementsByClassName("hao")[0].innerText);
			/* 
			  使用name方式返回 
			 */
			console.log(document.getElementsByName("号")[0]);
			console.log(document.getElementsByName("号")[0].innerText);
			/* 
			  使用id方式返回 
			 */
			console.log(document.getElementById('2').innerText="淘宝");
			console.log(document.getElementById('1').name);
			/* 
			 页面值修改 
			 */
			//方式一 ---直接改
			console.log(document.getElementsByName("号")[0].innerText="hao123");
			//方式二----定义变量，然后操作变量改
			var a = document.getElementById('2');
			a.href="http://www.huawei.com";
			a.innerText="淘宝1";
			
			 
		     //alert(document.getElementsByTagName("a")[0]);
		</script>
	</body>
</html>
